import clsx from "clsx"

interface TaskCardTagsProps {
  taskData: any,
  type?: 'task' | 'subtask'
}

export const TaskCardTags = ({ taskData, type = 'subtask' }: TaskCardTagsProps) => {
  if (!taskData.tags.length) return null

  return <div className='text-xs flex flex-wrap gap-2 '>
    {taskData.tags.map((task: TaskTag) => (
      <span key={task.tag} className={clsx('px-2 py-[2px]  rounded-3xl', type === 'task' ? 'bg-[#F1F5F7] text-[#2B7CD4] ' : 'bg-[#fff] text-[#555cf3]')}>#{task.tag}</span>
    ))}
  </div>

}